// 引入 G6 工具函数
import Util from '@antv/g6/src/util'
// 引入事件总线，用于组件间通信
import eventBus from "@/utils/eventBus";

export default {
    // 注册需要监听的事件
    getEvents() {
        return {
            'edge:mouseover': 'onMouseover',   // 边鼠标移入
            'edge:mouseleave': 'onMouseleave', // 边鼠标移出
            "edge:click": "onClick",         // 边点击
        };
    },
    // 边鼠标移入时的处理逻辑
    onMouseover(e) {
        const self = this;
        const item = e.item;
        const graph = self.graph;
        // 如果当前边已被选中，则不处理
        if (item.hasState('selected')) {
            return
        } else {
            // 判断是否允许更新状态
            if (self.shouldUpdate.call(self, e)) {
                graph.setItemState(item, 'hover', true);
            }
        }
        graph.paint();
    },
    // 边鼠标移出时的处理逻辑
    onMouseleave(e) {
        const self = this;
        const item = e.item;
        const graph = self.graph;
        const group = item.getContainer()
        // 恢复锚点样式
        group.find(g => {
            if (g._attrs.isInPoint || g._attrs.isOutPoint) {
                g.attr("fill", "#fff")
            }
        });
        if (self.shouldUpdate.call(self, e)) {
            if (!item.hasState('selected'))
                graph.setItemState(item, 'hover', false);
        }
        graph.paint();
    },
    // 边点击时的处理逻辑
    onClick(e) {
        const self = this;
        const item = e.item;
        const graph = self.graph;
        // 关闭自动渲染，批量操作提升性能
        const autoPaint = graph.get('autoPaint');
        graph.setAutoPaint(false);
        // 取消所有已选中的节点
        const selectedNodes = graph.findAllByState('node', 'selected');
        Util.each(selectedNodes, node => {
            graph.setItemState(node, 'selected', false);
        });
        // 如果没有按下多选键，则取消其他已选中的边
        if (!self.keydown || !self.multiple) {
            const selected = graph.findAllByState('edge', 'selected');
            Util.each(selected, edge => {
                if (edge !== item) {
                    graph.setItemState(edge, 'selected', false);
                }
            });
        }
        // 切换当前边的选中状态
        if (item.hasState('selected')) {
            if (self.shouldUpdate.call(self, e)) {
                graph.setItemState(item, 'selected', false);
            }
            // 通过事件总线通知选中状态变化
            eventBus.$emit('nodeselectchange', { target: item, select: false });
        } else {
            if (self.shouldUpdate.call(self, e)) {
                graph.setItemState(item, 'selected', true);
            }
            // 通过事件总线通知选中状态变化
            eventBus.$emit('nodeselectchange', { target: item, select: true });
        }
        // 恢复自动渲染
        graph.setAutoPaint(autoPaint);
        graph.paint();
    },

};
